<template>
    <router-view></router-view>
</template>

<script lang="ts">
    import {ref, provide} from 'vue'
    import {router} from "./router";

    export default {
        name: 'App',
        components: {},
        setup() {
            //通过获取当前页面的宽度来决定aside是否展示
            const width = document.documentElement.clientWidth;
            const asideVisible = ref(width <= 500 ? false : true)
            provide('asideVisible', asideVisible) //set

            router.afterEach(() => {
                if (width <= 500) {
                    asideVisible.value = false
                }
            })
        }
    }
</script>
